<template>
	<div id="app">
		<transition name="fade" mode="out-in">
			<router-view></router-view>
		</transition>
	</div>
</template>

<script>
export default {
	name: 'app',
	components: {
    },
    mounted(){
        //关闭首屏loading
        let layer=document.getElementsByClassName('loading-layer')[0];
        if(layer){
            setTimeout(() => {
                layer.remove()
            }, 500);
        }
    }
}

</script>

<style lang="scss">
body {
	margin: 0px;
	padding: 0px;
	/*background: url(assets/bg1.jpg) center !important;
		background-size: cover;*/
	// background: #1F2D3D;
	font-family: PingFang-SC-Medium;
	font-size: 14px;
	-webkit-font-smoothing: antialiased;
}

#app {
	position: absolute;
	top: 0px;
	bottom: 0px;
	width: 100%;
	background-color: #f0f0f0;
	min-width: 1280px;
}

.el-submenu [class^=fa] {
	vertical-align: baseline;
	margin-right: 0px;
}

.el-menu-item [class^=fa] {
	vertical-align: baseline;
	margin-right: 10px;
}
.el-menu-item {
    i{
        display: inline-block;
        min-width: 5px;
    }
}

// .el-submenu__title+.el-menu{
//     .el-submenu__title{
//         padding-left: 40px!important;
//     }
// }

.toolbar {
	background: #fff;
	padding: 10px;
	//border:1px solid #dfe6ec;
	margin: 10px 0px;
	.el-form-item {
		margin-bottom: 10px;
	}
}

.fade-enter-active{
    transition: opacity 1.5s
}
.fade-enter, .fade-leave-to,.fade-leave,.fade-leave-active /* .fade-leave-active in below version 2.1.8 */ {
    opacity: 0
}

</style>